/**
  需求：自定义一个权限指令，对需要权限判断的 Dom 进行显示隐藏。

  思路：
    自定义一个权限数组
    判断用户的权限是否在这个数组内，如果是则显示，否则则移除 Dom
 */
import { ObjectDirective } from 'vue';

function checkArray(key:any) {
  let arr = ['1', '2', '3', '4']
  let index = arr.indexOf(key)
  if (index > -1) {
    return true // 有权限
  } else {
    return false // 无权限
  }
}

const permission: ObjectDirective<any, string> = {
  mounted(el, binding) {
    const { value } = binding;
    if(value) {
      let hasPermission = checkArray(value)
      if (!hasPermission) {
        // 没有权限 移除Dom元素
        el.parentNode && el.parentNode.removeChild(el)
      }
    }
  }
}

export default permission;
